<template>
  <div class="navbar">
    <!-- <router-link :active-class="'current'" to="/goodsList" tag="div" class="item">首页</router-link>
    <router-link :active-class="'current'" to="/goodsTypeList" tag="div" class="item">全部分类</router-link>
    <router-link :active-class="'current'" to="/shopCart" tag="div" class="item">购物车</router-link>
    <router-link :active-class="'current'" to="/center" tag="div" class="item">会员中心</router-link> -->
    <van-tabbar route active-color=#e83225>
      <van-tabbar-item to="/goodsList" name="home" icon="shop-collect-o">首页</van-tabbar-item>
      <van-tabbar-item to="/goodsTypeList" name="search" icon="qr">全部分类</van-tabbar-item>
      <van-tabbar-item to="/shopCart" name="friends" icon="cart-o">购物车</van-tabbar-item>
      <van-tabbar-item to="/center" name="setting" icon="contact">会员中心</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
export default {
  name: "Navbar",
};
</script>

<style lang="scss">
.navbar {
  position: fixed;
  /* display: flex; */
  bottom: 0;
  width: 100%;
  .item {
    flex: 1;
    padding: 0.2rem 0;
    background: #eee;
    text-align: center;
    font-size: 0.24rem;
  }
  .current {
    color: #e83225;
  }
}
</style>
